﻿@model dynamic
@{
    ViewBag.Title = "管理";
    Layout = null;
}
<!DOCTYPE html>
<html class="full-height">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title | 特力惠综合导航</title>
    @Styles.Render(BundleConfig.CssCommon)
    @Styles.Render(BundleConfig.CssIview)
    <style>
        .layout {
            border: 1px solid #d7dde4;
            background: #f5f7f9;
            position: relative;
            height: 100%;
        }

        .layout-content {
            border: none;
            width: 98%;
            margin: 15px;
            overflow: hidden;
            background: #fff;
            border-radius: 4px;
        }

        .layout-copy {
            text-align: center;
            padding: 10px 0 20px;
            color: #9ea7b4;
        }

        .layout-menu-left {
            background: #464c5b;
        }

        .layout-header {
            height: 60px;
            background: #fff;
            box-shadow: 0 1px 1px rgba(0, 0, 0, .1);
        }

        .layout-logo-left {
            width: 90%;
            height: 30px;
            background: #5b6270;
            border-radius: 3px;
            margin: 15px auto;
        }

        html {
            height: 100%
        }

        body {
            height: 100%
        }

        .full-height {
            height: 100%
        }
    </style>
</head>
<body>
    <div class="layout" id="layout">
        <row type="flex" class="full-height">
            <i-col span="5" class="layout-menu-left">
                <i-menu :active-name="selectedMenu"
                        theme="dark"
                        width="auto"
                        :accordion="true"
                        @@on-select="selectMenu">
                    <div class="layout-logo-left"></div>
                    <submenu v-for="m in menus" :name="m.name" :key="m.name">
                        <template slot="title">
                            {{m.displayName}}
                        </template>
                        <menu-item v-for="subm in m.items" :name="subm.name" :key="subm.name">
                            {{subm.displayName}}
                        </menu-item>
                    </submenu>
                </i-menu>
            </i-col>
            <i-col span="19">
                <div class="layout-header"></div>
                <iframe class="layout-content" v-bind:src="src" height="85%"></iframe>
                <div class="layout-copy">
                    2017-2018 &copy; 特力惠研发部
                </div>
            </i-col>
        </row>
    </div>
    @Scripts.Render(BundleConfig.JsUnderscore)
    @Scripts.Render(BundleConfig.JsJquery)
    @Scripts.Render(BundleConfig.JsAbp)
    @Scripts.Render(BundleConfig.JsVue)
    @Scripts.Render(BundleConfig.JsIview)
    @{
        var ApplicationPath = "/";
    }
    <script type="text/javascript">
    //This is used to get the application's root path from javascript. It's useful if you're running application in a virtual directory under IIS.
    var abp = abp || {};
    abp.appPath = '@ApplicationPath';
    </script>
    <script src="@(ApplicationPath)api/AbpServiceProxies/GetAll" type="text/javascript"></script>
    <script src="@(ApplicationPath)AbpScripts/GetScripts" type="text/javascript"></script>
    <script>
        $(function () {
            window.vue = new Vue({
                el: "#layout",
                data: {
                    src: "",
                    selectedMenu: "",
                    menus: []
                },
                methods: {
                    selectMenu: function (name) {
                        var allmenus = _.union(this.menus,
                            _.chain(this.menus)
                                .pluck("items")
                                .union()
                                .value());
                        var url = _.chain(allmenus)
                            .union()
                            .flatten()
                            .compact()
                            .findWhere({ name: name })
                            .value()
                            .url;
                        this.src = url;
                    }
                }
            });
            abp.services.app.menuService.getUserMenus().done(function (data) {
                vue.selectedMenu = data[0].items[0].name;
                vue.src = data[0].items[0].items[0].url;
                vue.menus = data[0].items;
            });
        })
    </script>
</body>
</html>
